<script type="text/javascript">
	$(document).ready(function(){
		$('#map_time').html(String($('#startDate').val()) + ' - ' + String($('#endDate').val()))
		$('#legend').html($('#temp_legend').html())
		$('#legend').attr('style', "font-size: 11px")
		$('#temp_legend').html('')
	})
</script>

<div style="margin-bottom: 15px">
{{ map }}
</div>
{% if type != 'deviceSummary' and type != 'zoneSummary' %}
<div style="margin-bottom: 15px" align="center" id="map_time"></div>
{% endif %}
<div id='temp_legend'>
{% if type == 'map_top' %}
	<div class="series_color" style="background-color: blue"></div><div class="series_label" >Average operative temperature &lt; {{ heating_sp }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: green"></div><div class="series_label">{{ heating_sp }} &le; Average operative temperature &le; {{ cooling_sp }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >Average operative temperature &gt; {{ cooling_sp }}</div>
{% endif %}
{% if type == 'map_ppd' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" >PPD &le; 10</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: yellow"></div><div class="series_label">10 &lt; PPD &le; 30</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >PPD > 30</div>
{% endif %}
{% if type == 'ieq_map' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" > 75 &lt; Score &le; 100</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: yellow"></div><div class="series_label"> 50 &lt; Score &le; 75</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: orange"></div><div class="series_label" > 25 &lt; Score &le; 50</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" > Score &le; 25</div>
	<div style="clear: left; margin: 12px;"></div>
	{% if pmp %} (Score represents the percent of readings that fall within the limits defined by the PMP){% endif %}
{% endif %}
{% if type == 'map_lighting' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" >value &ge; {{ conditionG }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: yellow"></div><div class="series_label">{{ conditionY }} &le; value &lt; {{ conditionG }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >value &lt; {{ conditionY }} </div>
{% endif %}
{% if type == 'map_acoustics' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" >value &le; {{ conditionY }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: yellow"></div><div class="series_label">{{ conditionY }} &le; value &lt; {{ conditionG }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >value &gt; {{ conditionG }} </div>
{% endif %}
{% if type == 'map_iaq' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" >value &le; {{ conditionY }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: yellow"></div><div class="series_label">{{ conditionY }} &le; value &lt; {{ conditionG }}</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >value &gt; {{ conditionG }} </div>
{% endif %}
{% if type == 'deviceSummary' %}
	<div class="series_color" style="background-color: green"></div><div class="series_label" >Cart</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: #FF00FF"></div><div class="series_label">ICM</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: blue"></div><div class="series_label" >Sound level meter</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: orange"></div><div class="series_label" >Plenum mote</div>
	<div style="clear: left; margin: 12px;"></div>
	<div class="series_color" style="background-color: red"></div><div class="series_label" >Other</div>
	<div style="clear: left; margin: 12px;"></div>
{% endif %}
{% if type == 'plenum_map' %}
	<img src='/static/pmp/img/jetColorMap.png' />
{% endif %}
</div>
